<template lang="pug">
  .page
    .search-form.mb-10.pl-10.pr-10
      Row(type="flex" justify="start")
        Col.pr-20.mb-15(span="8")
          span.label-txt.w80 合同编号：
          Input(v-model="contractNo" placeholder="请输入" clearable)
        Col.pr-20.mb-15(span="8")
          span.label-txt.w110 申请人：
          Input(v-model="applyUser" placeholder="请输入" clearable)
        Col.pr-20.mb-15(span="8")
          Button(type="info" @click="searchBtn") 查询
    .tab-style-contract
      Tabs(type="card" :value="currentTab" :animated="false" @on-click="chooseTab")
        TabPane(label="合同管理" name="1")
          .stepContent
            tab_1(
              :contractList="contractList"
              :productTypeList="productTypeList"
              :selaTypeList="selaTypeList"
              :total="total"
              :PageIndex="PageIndex"
              :PageSize="PageSize"
              @get-list="getEmitList"
              @get-progress="getProgress"
              @down-file="downloadContract"
              @down-selafile="downloadSelaContract")
        TabPane(label="待审合同" name="2")
          .stepContent
            tab_2(
              ref = 'tab_2'
              :noExamineContractList="noExamineContractList"
              @get-list="getNoExamineContractList"
              @down-file="downloadContract"
              @get-progress="getProgress")
        TabPane(label="已审合同" name="3")
          .stepContent
            tab_3(
              :examineContractList="examineContractList"
              @down-file="downloadContract"
              @get-progress="getProgress")
    progressCheck(ref="progressCheck" :progressData="progressData")
</template>

<script>
import commerceContractApi from '@/api/commerceContract.api.js'
import Mixin from '../ccMixin.js'
import tab_1 from './tabs/tab-1.vue'
import tab_2 from './tabs/tab-2.vue'
import tab_3 from './tabs/tab-3.vue'
import progressCheck from './modal/progress.vue'

export default {
  name: 'examine_cc',
  data () {
    return {
      contractNo: '',
      applyUser:  '',
      applyUserList: [],
      progressData: [], // 审批进度
      currentTab: '1',
      contractList: [], // 合同列表
      noExamineContractList: [], // 待审核合同
      examineContractList: [], // 已审核合同
      total: 0,
      PageIndex: 1,
      PageSize: 10
    }
  },
  mixins: [Mixin],
  components: {
    tab_1,
    tab_2,
    tab_3,
    progressCheck
  },
  computed: {

  },
  created () {
    this.getContractList()
  },
  methods: {
    getProgress (val) {
      console.log('😝')
      this.$refs.progressCheck.openModal()
      console.log(val)
      commerceContractApi.ScheduleView({
        id: val.id,
        ContractNo: val.no,
        ContractType: val.type
      }).then(res => {
        console.log(res)
        this.progressData = res.data.data
      })
    },
    getEmitList (val) {
      console.log(val)
      this.PageIndex = val.PageIndex
      this.getContractList()
    },
    chooseTab (index) {
      if (index === this.currentTab) {
        return false
      } else {
        this.currentTab = index
        this.$refs.tab_2.contracts = []
        switch (index) {
          case '1':
            this.getContractList()
            break
          case '2':
            this.getNoExamineContractList()
            break
          case '3':
            this.getExamineContractList()
            break
        }
      }
    },
    // 合同管理列表
    getContractList () {
      commerceContractApi.GetContractList({
        ContractNo: this.contractNo,
        ApplyUser: this.applyUser, 
        PageIndex: this.PageIndex,
        PageSize: this.PageSize
      }).then(res => {
        if (res.data.success) {
          this.contractList = res.data.data
          this.total = res.data.totalRows
        } else {
          this.$Message.error({
            content: res.data.message,
            duration: 10,
            closable: true
          })
        }
      })
    },
    // 待审核合同
    getNoExamineContractList () {
      commerceContractApi.GetNoExamineContractList({
        ContractNo: this.contractNo,
        ApplyUser: this.applyUser, 
        PageIndex: this.PageIndex,
        PageSize: this.PageSize
      }).then(res => {
        if (res.data.success) {
          this.noExamineContractList = res.data.data
        } else {
          this.$Message.error({
            content: res.data.message,
            duration: 10,
            closable: true
          })
        }
      })
    },
    // 已审核合同
    getExamineContractList () {
      commerceContractApi.GetExamineContractList({
        ContractNo: this.contractNo,
        ApplyUser: this.applyUser, 
        PageIndex: this.PageIndex,
        PageSize: this.PageSize
      }).then(res => {
        if (res.data.success) {
          this.examineContractList = res.data.data
        } else {
          this.$Message.error({
            content: res.data.message,
            duration: 10,
            closable: true
          })
        }
      })
    },
    searchBtn () {
      this.PageIndex = 1
      switch (this.currentTab) {
        case '1':
          this.getContractList()
          break
        case '2':
          this.getNoExamineContractList()
          break
        case '3':
          this.getExamineContractList()
          break
      }
    }
  }
}
</script>

<style lang="less">
  .tab-style-contract{
    .ivu-tabs-bar{
      margin-bottom: 0;
    }
    .ivu-tabs-content {
      .ivu-tabs-tabpane {
        background: #fff;
        padding: 0px 16px 10px;
        border: 1px solid #dcdee2;
        border-top: none;
        .stepContent{
          position: relative;
          width: 100%;
          height: 100%;
        }
        .tab-footer{
          position: absolute;
          bottom: -40px;
          right: 0;
        }
      }
    }
  }
</style>
